import React from 'react'
// useSelector的作用: 帮我们监听redux数据的变化,当数据变化之后,让组件更新.更新还能帮我们过滤数据
import { useSelector, useDispatch } from 'react-redux'
export default function Count() {
  const count = useSelector((state) => {
    // 这个state就是store中存储的数据
    // 返回值,最终成为了useSelector的返回值
    return state.count
  })
  // 这个dispatch其实就是store.dispatch
  const dispatch = useDispatch()
  return (
    <div>
      <h1>Count</h1>
      <hr />
      <p>{count}</p>
      <button
        onClick={() => {
          dispatch({ type: 'add' })
        }}
      >
        +
      </button>
    </div>
  )
}
